<template>
    <el-container>
        <el-aside width="312px">
            <img src="@/assets/images/dbktlogo.jpg" width="312" alt="" srcset="">
            <el-row type="flex" class="row-bg">
                <el-col :span="12"  class="pagecol1">
                    <router-link to='/classroom/modular/1' class="btn  colormo colormo1 bgcolorsh"  >模块介绍</router-link>
                </el-col>
                <el-col :span="12" class="pagecol2" >
                    <span to='/classroom/paradise' class="btn    colormo colormo2 bgcolorsh" >逗包乐园</span>
                </el-col>
            </el-row>
            <router-view class="view one"  ></router-view>
        </el-aside>
        <router-view class="view two" name="classright"></router-view>
        <!-- <el-footer height="38px">Footer</el-footer> -->
    </el-container>
</template>

<script>
export default {
    mounted() {

    },
    methods: {
        back () {

        }
    }
};
</script>

<style scoped>
.el-aside {
    margin-right: 12px;
}
.pagecol1 {
    text-align: left;
}
.pagecol2 {
    text-align: right;
}
.row-bg {
  text-align: center;
  margin-top: 2px;
  margin-bottom: 2px;

}
.colormo {
    color: #54dde5;
    font-size: 30px;
    width: 144px;
    line-height: 86px;
    height: 86px;
    margin-top: 12px;
    margin-bottom: 12px;
}

.router-link-exact-active {
    background-color: #ffc72a;
}
.el-footer {
    margin-top:12px;
    background: #fff799;
}

.el-container {
    margin-top: 12px;
    margin-bottom: 12px;
}
</style>

